<template>
	<div class="wrapper">
		<div class="pl12 pp12 pr12 pb12">
			<Card class="Position">
				<div class="Entrance flex">
					<span
						class="entranceSpan"
						:class="{spanTips1:index==0}"
						v-for="(item ,index) in entrance"
						:key="index"
					>
						<div style="position: relative">
							<Badge dot style="position: absolute;z-index: 10;right: 0" v-if="item.code=='todo'"></Badge>
							<img
								style="width: 60px;height: 60px"
								@click="entranceClick(item.url)"
								:class="{img1:index==0}"
								:src="item.imageUrl"
								alt
							/>
							<div class="span-tips">{{item.sysName}}</div>
						</div>
					</span>
				</div>
			</Card>
		</div>
	</div>
</template>

<script>
import Cookies from 'js-cookie'
import { fromPost } from '@/libs/tool'
import { systemGet } from '@/api/index.js'
export default {
	name: 'design-element',
	components: {},
	props: {},
	data() {
		return {
			entrance: [],
			userInfo: '', //用户信息
			accessToken: '',
		}
	},
	watch: {},
	computed: {},
	methods: {
		fromSummit: fromPost,
		init() {
			let userInfo = JSON.parse(Cookies.get('userInfo'))
			this.systemGet()
		},
		entranceClick(item) {
			if (item) {
				let data = {
					authToken: this.accessToken,
					templateName: 'homepage',
					infoID: null,
				}
				this.fromSummit(item, data)
			}
		},
		systemGet() {
			//快捷入口
			systemGet({ idcard: this.userInfo.idcard }).then((res) => {
				if (res.code == 200) {
					this.entrance = res.result
				} else {
					this.$Message.error(res.message)
				}
			})
		},
	},
	created() {
		this.accessToken = this.getSession('accessToken')
		this.init()
	},
	mounted() {},
}
</script>
<style lang="less" scoped>
.wrapper {
	width: 100%;
	height: 100%;
}
</style>
<style lang="less">
@import './less/home.less';
@import '../../styles/common.less';
.my-card {
	.ivu-card-body {
		padding: 10px 12px;
	}
}
.my-card1 {
	.ivu-card-body {
		padding: 0;
	}
}
</style>
<style scoped lang="less">
@import './less/page_home.less';
.demo-carousel {
	width: 100%;
	height: 100%;
}
.page_home_main {
	height: 100%;
}
.page_home_scroll {
	height: 100%;
	width: 100%;
}
</style>